<template>
  <el-upload :ref='imageRef' class='upload' action='/' :multiple='true' :auto-upload='false' :on-change='handleChange' :on-remove='handleRemove' :file-list='images' :before-upload='beforeUpload'>
    <i class='el-icon-plus avatar-uploader-icon'></i>
    <span class='ml10 file-tip'>请上传文档需要的图片.</span>
  </el-upload>
</template>

<script>
import { ref, isRef, unref, reactive, toRefs } from "vue";
export default {
  name: 'note-images',
  props: ['images'],
  emits: ['handleImageChange'],
  setup (props, { emit }) {
    const { images } = toRefs(props);
    const imageRef = ref(null);

    const handleRemove = (file, fileList) => {
      emit('handleImageChange', unref(fileList));
    };
    const beforeUpload = file => {
    };

    const handleChange = (file, fileList) => {
      emit('handleImageChange', unref(fileList));
    }

    return {
      images,
      imageRef,
      handleChange,
      handleRemove,
      beforeUpload
    }
  }
}
</script>

<style>
</style>